import styled from "styled-components";

export const SongPopoverWrap = styled.div`
  position: absolute;
  top: 86px;
  left: 10px;
  display: ${(props) => (props.show ? "block" : "none")};
  z-index: 999;
  width: 720px;
  border: 1px solid #bebebe;
  height: 361px;
  background-color: #fff;
  .a_l {
    border-bottom: 1px solid #bebebe;
    height: 70px;
    .check_line {
      cursor: pointer;
      background-position: right -100px;
      height: 31px;
      line-height: 31px;
      display: inline-block;
      padding: 0 5px 0 0;
      margin: 25px 0 0 12px;

      .all-style {
        display: inline-block;
        color: #333;
        padding: 0 10px 0 15px;
        background-position: 0 -59px;
        height: 31px;
        line-height: 31px;
      }
    }
  }
  .style-box-content {
    .categories-box {
      display: flex;
      :nth-last-child(1) .category-div {
        padding-bottom: 35px;
      }
      .style-name {
        display: inline-block;
        width: 97px;
        height: 42px;
        font-weight: bold;
        padding-left: 38px;
        padding-top: 19px;
        position: relative;
        .category-icon {
          display: inline-block;
          position: absolute;
          width: 23px;
          height: 23px;
          left: 10px;
          top: 15px;
        }
        .category-icon-one {
          background-position: -20px -735px;
        }
        .category-icon-two {
          background-position: 0px -60px;
        }
        .category-icon-three {
          background-position: 0px -88px;
        }
        .category-icon-four {
          background-position: 0px -117px;
        }
        .category-icon-five {
          background-position: 0px -141px;
        }
      }
      .category-div {
        flex: 1;
        border-left: 1px solid #e6e6e6;
        padding: 16px 15px 0 15px;
        .category-name {
          line-height: 24px;

          .cursor-name {
            cursor: pointer;
          }
        }
        .category-line {
          margin: 0 8px 0 10px;
          color: #d8d8d8;
        }
      }
    }
  }
`;
